<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>update</title>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>

<div id="app">
    <form>
        id:<input v-model="user.userId" readonly><br/>
        姓名:<input type="text" v-model="user.userName"><br/>
        密码:<input type="text" v-model="user.password"><br/>
        email:<input type="text" v-model="user.email"><br/>
        tel:<input type="text" v-model="user.tel"><br/>
        <input @click="update()" type="button" value="确认修改"/>
    </form>
</div>

<script>

    new Vue({
        el: '#app',
        data: {
            user:{
                userId:'',
                userName:'',
                password:'',
                email:'',
                tel:''
            },
            id:''
        },
        methods:{
          findOneById: function () {
              _this  = this;
              axios.get('/user/findOneById/'+_this.id).then(function (res) {
                  _this.user = res.data
              })
          },
          update: function () {
              _this = this;
              axios.post('/user/update',_this.user).then(function (res) {
                  if (res != null){
                      window.location="index.html";
                  } else {
                      alert("你的操作有误");
                  }
              })
          }
        },
        mounted: function () {

        },
        created: function () {
            this.id = window.localStorage.getItem("userId");
            this.findOneById();
        }
    })


</script>

</body>
</html>